import { Link, useNavigate } from "react-router-dom";
import { Button, Form, Input } from "antd-mobile";
import Logo from "../components/logo";
import { loginAPI } from "../services/auth";
import { setToken } from "../utils/tools";
// import res from "antd-mobile-icons/es/AaOutline";
function Login() {
  const nav = useNavigate();
  return (
    <div className="login">
      <Logo />

      <Form
        onFinish={(v) => {
          // console.log(v);
          if ((v.userName == v.userName, v.password == v.password)) {
            loginAPI({
              userName: v.userName,
              password: v.password,
            }).then((res) => {
              console.log(res);
              if (res.success == true) {
                setToken(res.data);
                nav("/");
              } else {
                alert(res.errorMessage);
              }
            });
          }
        }}
      >
        <Form.Item
          label="用户名"
          name="userName"
          rules={[
            {
              required: true,
              message: "用户名不能为空",
            },
          ]}
        >
          <Input placeholder="请输入用户名" />
        </Form.Item>
        <Form.Item
          label="密码"
          name="password"
          rules={[
            {
              required: true,
              message: "密码不能为空",
            },
          ]}
        >
          <Input type="password" placeholder="请输入密码" />
        </Form.Item>
        <Button type="submit" color="primary" block>
          登录
        </Button>
      </Form>
      <Link to="/reg">没有账号，我要注册</Link>
    </div>
  );
}

export default Login;
